<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <meta charset="utf-8">
        <title>Dashboard</title>
        <meta name="generator" content="Bootply"/>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <link href="../resources/css/bootstrap.min.css" rel="stylesheet">
        <link href="../resources/css/dashboard.css" rel="stylesheet">
        <script type='text/javascript' src="../resources/js/jquery-2.1.1.min.js"></script>
        <script type='text/javascript' src="../resources/js/bootstrap.min.js"></script>

    </head>
    <body>
        <jsp:include page="common/top-bar.jsp"/>

        <div class="container">

            <!-- upper section -->
            <div class="row">
                <div class="col-sm-3">
                    <jsp:include page="common/nav-bar.jsp"/>

                </div>
                <!-- /span-3 -->
                <div class="col-sm-9">
                    <div id="msg"></div>
                    <!-- column 2 -->
                    <h3><i class="glyphicon glyphicon-plus-sign"></i>Manage Shipment</h3>

                    <hr>

                    <div class="row">
                        <c:choose>                            
                            <c:when test="${empty bookingId || not validBooking}">
                                <form class="form-horizontal" role="form" method="GET">
                                    <div class="form-group">
                                        <label for="referenceId" class="col-sm-2 control-label">Booking Id</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" id="bookingId" name="bookingId" placeholder="Booking Id">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <div class="col-sm-offset-2 col-sm-10">
                                            <button type="submit" class="btn btn-default">Get Booking</button>
                                        </div>
                                    </div>
                                </form>
                                <c:if test="${not validBooking && not empty bookingId}">
                                    <div class="alert alert-danger alert-dismissible" role="alert">
                                        <button type="button" class="close" data-dismiss="alert">
                                            <span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                        Invalid Booking ID! Please try again.
                                    </div>
                                </c:if>
                            </c:when>
                            <c:otherwise>
                                <form class="form-horizontal" role="form" method="POST">
                                    <div class="form-group">
                                        <label for="bookingId" class="col-sm-2 control-label">Booking Id</label>
                                        <div class="controls readonly">${bookingId}</div>
                                        <input type="hidden" name="payment.id" value="${bookingId}" />
                                    </div>
                                    <div class="form-group">
                                        <label for="currentStatus" class="col-sm-2 control-label">Current Status</label>
                                        <div id="currentStatus" class="controls readonly">${shipment.status}</div>
                                    </div>
                                    <div class="form-group">
                                        <label for="status" class="col-sm-2 control-label">Status</label>
                                        <div class="col-sm-10">
                                            <select name="status" class="form-control">
                                                <c:forEach items="${statusList}" var="st">
                                                    <option selected value=${st}>${st}</option>
                                                </c:forEach>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="remarks" class="col-sm-2 control-label">Remarks</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" id="remarks" name="remarks" placeholder="Remarks">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <div class="col-sm-offset-2 col-sm-10">
                                            <button type="submit" class="btn btn-default">Save Booking</button>
                                        </div>
                                    </div>
                                </form>
                            </c:otherwise>
                        </c:choose>
                    </div>
                    <!--/col-->


                </div>
                <!--/row-->
            </div>
            <!--/col-span-9-->

        </div>
        <!--/row-->

    </div><!--/container-->
    <!-- /Main -->

</body>
</html>
